import React from 'react'
import { Outlet ,NavLink} from 'react-router-dom';
import { mainRoute } from '../View/RouteConfig';
import { Tabbar } from 'react-vant';

function Home() {
    return (
        <div className='Home'>
            <main>
                <Outlet></Outlet>
            </main>
            <footer>
                <Tabbar>
                    {
                        mainRoute.map((item,index)=>{
                            return <Tabbar.Item icon={<item.icon />} key={index}>
                                <NavLink to={item.path}>{item.txt}</NavLink>
                            </Tabbar.Item>
                        })
                    }
                </Tabbar>
            </footer>
        </div>
    )
}

export default Home